<!DOCTYPE html>
<html class="x-admin-sm">
<head>
    <meta charset="UTF-8">
    <title>财务管理</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi"/>
    <link rel="stylesheet" href="/web/res/css/xadmin.css">
    <script src="/web/res/lib/layui/layui.js" charset="utf-8"></script>
    <script type="text/javascript" src="/web/res/js/xadmin.js"></script>
</head>

<body>
<div class="x-nav">
        <span class="layui-breadcrumb">
            <a href="">首页</a>
            <a href="">财务管理</a>
            <a><cite>vip订单管理</cite></a>
        </span>
    <a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right"
       onclick="location.reload()" title="刷新">
        <i class="layui-icon layui-icon-refresh" style="line-height:30px"></i></a>
</div>
<div class="layui-fluid">
    <div class="layui-row layui-col-space15">
        <div class="layui-col-md12">
            <div class="layui-card">
                <div class="layui-card-header">

                    <a class="layui-btn layui-btn-small lable-text-center"
                       style="line-height:1.6em;margin-top:3px;float:right" onclick="location.reload()"
                       title="刷新">
                        <i class="layui-icon layui-icon-refresh" style="line-height:30px"></i>刷新表格数据</a>
                </div>

                <div class="layui-card-body ">
                    <form class="layui-form layui-col-space5" type="post" action="/after/viporder/list">
                        <div class="layui-input-inline layui-show-xs-block">
                            <input type="text" name="nick" value="${nick!''}" placeholder="下单人名称"
                                   autocomplete="off" class="layui-input">
                        </div>
                        <div class="layui-input-inline layui-show-xs-block">
                            <input type="text" name="phone" value="${phone!''}" placeholder="下单人电话"
                                   autocomplete="off" class="layui-input">
                        </div>
                        <div class="layui-input-inline layui-show-xs-block">
                            <input type="text" name="orderNo" value="${orderNo!''}" placeholder="订单号"
                                   autocomplete="off" class="layui-input">
                        </div>
                        <div class="layui-input-inline layui-show-xs-block">
                            <select name="type">
                                <option value="">支付方式</option>
                                <#list statesMap?keys as key>
                                <option value="${key!''}" <#if type?exists && (type)?exists><#if (type)?number == key?number>selected</#if></#if> > <@mapIntString map=statesMap key=key/></option>
                                </#list>
                            </select>
                        </div>
                        <div class="layui-input-inline layui-show-xs-block">
                            <select name="status">
                                <option value="">支付状态</option>
                                <#list userStatusMap?keys as key>
                                <option value="${key!''}" <#if status?exists && (status)?exists><#if (status)?number == key?number>selected</#if></#if> > <@mapIntString map=userStatusMap key=key/></option>
                                </#list>
                            </select>
                        </div>
                        <div class="layui-input-inline layui-show-xs-block">
                            <select name="refundStatus">
                                <option value="">退款状态</option>
                                <#list refundStatusMap?keys as key>
                                <option value="${key!''}" <#if refundStatus?exists && (refundStatus)?exists><#if (refundStatus)?number == key?number>selected</#if></#if> > <@mapIntString map=refundStatusMap key=key/></option>
                            </#list>
                            </select>
                        </div>
                        <div class="layui-input-inline layui-show-xs-block">
                            <input class="layui-input" placeholder="开始时间" value="${startdate!''}" name="startdate" id="startdate">
                        </div>
                        <div class="layui-input-inline layui-show-xs-block">
                            <input class="layui-input" placeholder="截止时间" value="${enddate!''}" name="enddate" id="enddate">
                        </div>
                        <div class="layui-input-inline layui-show-xs-block">
                            <input type="text" name="price" value="${price!''}" placeholder="退款金额"
                                   autocomplete="off" class="layui-input">
                        </div>
<!--                        <div class="layui-input-inline layui-show-xs-block"  style="display: none !important">-->
                            <input type="text" name="orderType" value="2" placeholder="订单类型" style="display: none !important">
<!--                        </div>-->
                        <div class="layui-input-inline layui-show-xs-block">
                            <button class="layui-btn" lay-submit lay-filter="search">
                                <i class="layui-icon">&#xe615;</i>搜索
                            </button>
                        </div>
                    </form>
                </div>
                <!--表格-->
                <div class="layui-card-body">
                    <table class="layui-table layui-form tableH" lay-size="sm" id="tab">
                        <!--表头-->
                        <thead>
                        <tr>
<!--                            <th>id</th>-->
<!--                            <th>收款商户</th>-->
<!--                            <th>商户ID</th>-->
<!--                            <th>下单人id</th>-->
                            <th>订单号</th>
                            <th>用户头像</th>
                            <th>用户名称</th>
                            <th>用户电话</th>
                            <th>金额</th>
                            <th>支付状态</th>
                            <th>退款状态</th>
                            <th>支付方式</th>
                            <th>创建时间</th>
                            <th>设备</th>
                            <#if canRefund >
                            <th>退款时间</th>
                            <th>操作</th>
                            </#if>
                        </tr>
                        </thead>
                        <!--表内容-->
                        <tbody>
                        <#if list?? && (list?size > 0) >
                        <#list list as li>
                        <tr>
<!--                            <td>${(li.id?c)!''}</td>-->
<!--                            <td>${li.mchName!''}</td>-->
<!--                            <td>${li.mchId!''}</td>-->
<!--                            <td>${li.userId!''}</td>-->
                            <td>${li.orderNo!''}</td>
                            <td>
                                <a href="javascript:void(0);" class="img_biges" title="${(li.pic)!''}">
                                    <img src="${(li.pic)!''}" style=" width:35px;height:35px;"/>
                            </td>
                            <td>${li.nick!''}</td>
                            <td>${li.phone!''}</td>
                            <td>${li.price!''}</td>
                            <td><@mapIntString map=userStatusMap key=li.status/></td>
                            <td><@mapIntString map=refundStatusMap key=li.refundStatus/></td>
                            <td><@mapIntString map=statesMap key=li.type/></td>
                            <td>${(li.createTime?string("yyyy-MM-dd HH:mm:ss"))!}</td>
                            <td>${li.mobileSpec!''}</td>
                            <#if canRefund >
                            <td>${(li.refundTime?string("yyyy-MM-dd HH:mm:ss"))!}</td>
                            <td class="td-manage btn-centers">
                                <button class="layui-btn layui-btn-xs  layui-btn-danger" onclick="refund(`${li.orderNo}`)">
                                    退款
                                </button>
                            </td>
                        </#if>
                        </tr>
                        </#list>
                        <#else>
                        <tr>
                            <td colspan="4" style="text-align: center;">暂无记录</td>
                        </tr>
                        </#if>
                        </tbody>
                    </table>
                </div>
                <!-- 分页条 -->
                <div id="pager" style="text-align: center;"></div>
            </div>
        </div>
    </div>
</div>
</body>

<script>
    layui.use(['laydate', 'form', 'table'], function () {
        let $ = layui.$;
        var laydate = layui.laydate;
        var form = layui.form;
        var table = layui.table;

        //执行一个laydate实例
        laydate.render({
            elem: '#startdate',
            type: 'datetime'
        });

        //执行一个laydate实例
        laydate.render({
            elem: '#enddate',
            type: 'datetime'
        });

        // 监听全选
        form.on('checkbox(checkall)', function (data) {
            if (data.elem.checked) {
                $('.check input').prop('checked', true);
            } else {
                $('.check input').prop('checked', false);
            }
            form.render('checkbox');
        });

        // //执行一个laydate实例
        // laydate.render({
        //     elem: '#start' //指定元素
        // });
        //
        // //执行一个laydate实例
        // laydate.render({
        //     elem: '#end' //指定元素
        // });
    });


</script>
<!-- 注意：如果你直接复制所有代码到本地，上述js路径需要改成你本地的 -->
<script>
    layui.use(['laypage', 'layer', 'form'], function(){
        let $ = layui.$;
        var laypage = layui.laypage
            ,form = layui.form
            ,layer = layui.layer;

        laypage.render({
            elem: 'pager'
            ,count: ${(splitPage.totalCount?c)!''}
            ,limit: ${(splitPage.pageSize?c)!''}
            ,curr: ${(splitPage.pageIndex?c)!''}
            ,layout: ['count', 'prev', 'page', 'next', 'limit', 'refresh', 'skip']
            ,jump: function(obj, first){
                //首次不执行
                if(!first){
                    var myform = document.forms[0];
                    // alert("formName:"+myform.id);
                    var pageIndex = document.createElement("input");
                    pageIndex.name="pageIndex";
                    pageIndex.type="hidden";
                    pageIndex.value=obj.curr;
                    myform.appendChild(pageIndex);

                    var pageSize = document.createElement("input");
                    pageSize.name="pageSize";
                    pageSize.type="hidden";
                    pageSize.value=obj.limit;
                    myform.appendChild(pageSize);
                    $("button[lay-submit]:eq(0)").click();
                }
            }
        });
    });

    function refund(orderNo){
        ajaxPost($,"/after/viporder/refund",{"orderNo": orderNo},function (data) {
            console.log(JSON.stringify(data))
            if (data.code == 0) {
                layer.msg(data.msg, {icon: 1, time: 1000}, function(){
                    location.reload();
                });
            } else {
                layer.msg(data.msg, {icon: 2, time: 2000}, function(){});
            }
        });
    }

</script>


</html>
